<template>
  <div>
    <div class="upload">
      <a-upload
        name="file"
        action="http://127.0.0.1:8080/api/song/batch_upload_music"
        @change="handleChange"
        :before-upload="beforeUpload"
      >
        <a-button>
          上传文件
        </a-button>
      </a-upload>
    </div>

    <div class="download">
      <a :href="downloadUrl"
        ><a-button type="primary" @click="download">下载文件</a-button></a
      >
    </div>
  </div>
</template>

<script>
import {get_one} from "@/request/api/music"
export default {
  name: "Download",
  data() {
    return {
      headers: "header",
      downloadUrl: ""
    };
  },
  mounted(){
      const data={
          id:290
      }
      get_one(data).then((res) => {
          console.log(res);
      }).catch((err) => {
          console.log(err)
      })
  },
  methods: {
    handleChange(info) {
      if (info.file.status === "done") {
        this.$message.success(`文件上传成功`);
      }
      if (info.file.status === "error") {
        this.$message.error(`文件上传失败`);
      }
    },
beforeUpload(file) {
      const isRarOrZip = file.type === 'zip' || file.type === 'rar';
      if (!isRarOrZip) {
        this.$message.error('只能上传压缩文件');
      }
      const isLt1GB = file.size / 1024 / 1024 < 1024;
      if (!isLt1GB) {
        this.$message.error('文件大小不得超过1GB');
      }
      return isRarOrZip && isLt1GB;
    },


    download() {
      this.downloadUrl =
        "https://image.baidu.com/search/down?tn=download&word=download&ie=utf8&fr=detail&url=https%3A%2F%2Fgimg2.baidu.com%2Fimage_search%2Fsrc%3Dhttp%253A%252F%252Ffile02.16sucai.com%252Fd%252Ffile%252F2014%252F0827%252Fc0c92bd51bb72e6d12d5b877dce338e8.jpg%26refer%3Dhttp%253A%252F%252Ffile02.16sucai.com%26app%3D2002%26size%3Df9999%2C10000%26q%3Da80%26n%3D0%26g%3D0n%26fmt%3Dauto%3Fsec%3D1651931497%26t%3D94e6f8d12e23374e332566f3709eccb5&thumburl=https%3A%2F%2Fimg1.baidu.com%2Fit%2Fu%3D4127991555%2C3421789262%26fm%3D253%26fmt%3Dauto%26app%3D138%26f%3DJPEG%3Fw%3D680%26h%3D454";
    }
  }
};
</script>

<style>
.upload {
  background-color: #c3d7df;
  width: 300px;
  height: 100px;
  margin: 100px auto;
}

.download {
  background-color: #c3d7df;
  width: 300px;
  height: 100px;
  margin: 100px auto;
}
</style>
